<!DOCTYPE html>
<html>
<head>
    <meta content="text/html; charset=UTF-8" http-equiv="content-type"/>
    <title>Home</title>
</head>
<body class="lift:content_id=main">
<div id="main" class="lift:surround?with=default;at=content">

    <div data-lift="PromisingStuff">
        <!-- Promise-related scripts will be inserted here -->
    </div>


    <div data-wombat="David">My wombat is named: </div>
    <div data-sloth="Archer">My sloth is named: </div>

    <hr>

    <div id="foo">Hi... I'm the foo div</div>


    <div>Enter some text <input id="in"> and
        <button onclick="sendToServer(document.getElementById('in').value)">Click me</button>
    </div>

    <hr>

    <div id="foo2">Hi... I'm the foo div</div>


    <div>Enter some text <input id="in2"> and
        <button onclick="myFuncs.thing(document.getElementById('in2').value).then(function(v) {document.getElementById('foo2').textContent = v;})">Click me</button>
    </div>

    <p>

    <div data-lift="ActNice">this will disappear</div>
    <hr>

    <div data-jssource="false ? '' : []">
        Hi!
        <hr>
    </div>



    <ul>
        <li data-jssource="* *+ #> ['fpx',2,'dog', 'hi']">Wombat: </li>
    </ul>


    <script>
        function changeNode(str) {
          document.getElementById("foo").textContent = str;
        }
    </script>

    <ul>
        <li data-jssource="[{'name': 'David', age: 49},{'name': 'Wombat'}, {name: 'Archer', age: 9}]">
            <span data-jssource="* *+ #> it.name">Name: </span>
            <span data-jssource="* *+ #> it.age">Age: </span>
        </li>
    </ul>

    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>
    <div data-sloth="Archer">My sloth is named:</div>



    </p>
</div>
</body>
</html>

